<template>
	<div class="wrapper">
		<van-cell-group inset>
			<van-field v-model="phone" type="number" label="手机号" placeholder="请输入用户手机号" />
			<van-field v-model="sms" type="number" center clearable label="短信验证码" placeholder="请输入短信验证码">
				<template #button>
					<van-button size="small" color="#66d6ff" v-if="time === 0 && isOne" type="primary"
						@click="getLoseLoginPassSecurityCode">
						发送验证码
					</van-button>
					<van-button size="small" v-if="time === 0 && !isOne" color="#66d6ff" type="primary"
						@click="getLoseLoginPassSecurityCode">
						发送验证码
					</van-button>
					<van-button size="small" v-if="time !== 0" type="primary" color="#66d6ff" disabled>{{ time }}
						重新获取</van-button>
				</template>
			</van-field>
			<van-field v-model="password" type="password" label="密码" placeholder="请输入密码" />
			<van-field v-model="passwordEnter" type="password" label="确认密码" placeholder="请确认密码" />
		</van-cell-group>
		<div class="btn" @click="getSecurityCodeValid">确定</div>
	</div>
</template>

<script>
	import {
		defineComponent
	} from 'vue'
	import {
		loseLoginPassSecurityCode
	} from '@/api/wallet'
	import store from '@/store'
	import {
		showSuccessToast,
		showToast
	} from 'vant'
	import {
		checkMobile
	} from '@/utils/utils'
	import {
		loseLoginPassword
	} from '@/api/agent'
	import JSEncrypt from 'jsencrypt'

	export default defineComponent({
		name: 'getCode',
		setup() {
			const route = useRoute()
			const router = useRouter()
			const state = reactive({
				phone: '',
				time: 0,
				isOne: true,
				password: '',
				passwordEnter: '',
				interV: null,
				code: '',
				pay: null,
				userInfo: {},
				username: '',
				securityCode: '',
				sms: ''
			})

			const getLoseLoginPassSecurityCode = () => {
				if (!state.phone && !checkMobile(state.phone)) {
					showToast('请输入正确的11位手机号码')
					return
				}
				loseLoginPassSecurityCode({
					username: state.phone
				}).then(res => {
					if (res.code == 200) {
						showToast('验证码获取成功')
						if (state.interV) clearInterval(state.interV)
						state.time = 60
						state.interV = setInterval(() => {
							state.time = state.time - 1
							if (state.time == 0) {
								clearInterval(state.interV)
								state.isOne = false
							}
						}, 1000)
					}
				})
			}
			const getSecurityCodeValid = () => {
				if (!state.sms) {
					showToast('请输入验证码')
					return
				}
				if (!state.password) {
					showToast('请输入新密码')
					return
				}
				if (state.password !== state.passwordEnter) {
					showToast('两次新密码不一致,请检查')
					return
				}
				const key =
					'MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAicjwP+F30h1RmMZuAjKIW7+pJxK6NlhvsNks28X4/91iF7lBoZd57ZuN+310vaFxol8khFd5SDbnx7piqPxuAaUC/IygD4iPn2ZSSA5pqqdQYodJVckyh4PNjbh6lDkjYNoAGhz1BY+AiQz2uPTNFnOqmDu1ZfhoQCWMhSleW0zikybl3KRcczDja96+DmKkssXAYN5clnnZMcBjuWOwBz5pgHiQEQTatdWm/un3SR366LrnKAXYUyAEUxwuEA9qtiaDvKgLzSl84FqmvU6cLzmLJM+b+++0CONoT0IR9I6XFkF/wErnd8Y+gEB4oQEURe39BUjl5VcxSJxf1HorSQIDAQAB'
				// 调注册接口
				let jse = new JSEncrypt()
				jse.setPublicKey(key)
				let newPassword1 = jse.encrypt(state.password)
				console.log(store.state.user.userInfo)
				loseLoginPassword({
					username: state.phone,
					newPassword: newPassword1,
					securityCode: state.sms
				}).then(res => {
					if (res.code == 200) {
						showSuccessToast('修改成功')
						setTimeout(() => {
							uni.redirectTo({
								//关闭当前页面，跳转到应用内的某个页面。
								url: '/pages/login'
							});
						}, 1500)
					}
				})
			}
			return {
				...toRefs(state),
				getLoseLoginPassSecurityCode,
				getSecurityCodeValid
			}
		}
	})
</script>

<style scoped lang="scss">
	.wrapper {
		padding: 10px 0;

		.btn {
			width: 150px;
			height: 40px;
			background: #66d6ff;
			opacity: 1;
			border-radius: 6px;
			display: flex;
			align-items: center;
			justify-content: center;
			color: white;
			margin: 50px auto;
		}
	}
</style>